<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="format-detection" content="telephone=yes" />
    <meta content="noindex,nofollow" name="robots" />
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate">
    <meta http-equiv="expires" content="0">
    <title>久久商城</title>
    <link rel="stylesheet" type="text/css" href="__STATIC__/themes/css/core.css?v={$v}">
    <link rel="stylesheet" type="text/css" href="__STATIC__/themes/css/icon.css?v={$v}">
    <link rel="stylesheet" type="text/css" href="__STATIC__/themes/css/home.css?v={$v}">
    <script type="text/javascript" src="__STATIC__/themes/js/jquery.min.js?v={$v}"></script>
</head>
<body>

<header class="aui-header-default aui-header-fixed aui-header-bg">
    <a href="{:url('index/center/myAddress')}" class="aui-header-item">
        <i class="aui-icon aui-icon-back-white"></i>
    </a>
    <div class="aui-header-center aui-header-center-clear">
        <div class="aui-header-center-logo">
            <div class="aui-car-white-Typeface">新建地址</div>
        </div>
    </div>
    <a href="#" class="aui-header-item-icon" style="min-width:0;visibility:hidden;">
        <i class="aui-icon aui-icon-member"></i>
    </a>
</header>
<section class="aui-myOrder-content">
    <form action="{:url('index/center/saveAddress')}" method="post">
        <div class="aui-Address-box">
            <p>
                <input class="aui-Address-box-input" type="text" name="name" required placeholder="收货人姓名" style="border-bottom: 1px solid #ccc;">
            </p>
            <p>
                <input class="aui-Address-box-input" type="text" name="phone" required placeholder="手机号码" style="border-bottom: 1px solid #ccc;">
            </p>

            <p style="margin-top: 10px;">
                省： <select name="country" id="country" style="width: 90%;height: 35px;padding-left: 10px" required>
                <option value="">请选择</option>
                {volist name="country" id="cou"}
                <option value="{$cou.id}">{$cou.cityname}</option>
                {/volist}
            </select>
            </p>

            <p style="margin-top: 10px;">
                市： <select name="city" id="city" style="width: 90%;height: 35px;padding-left: 10px" required>
                <option value="">请选择</option>
            </select>
            </p>

            <p style="margin-top: 10px;">
                区： <select name="district" id="district" style="width: 90%;height: 35px;padding-left: 10px" required>
                <option value="">请选择</option>
            </select>
            </p>
            <p>
                <input class="aui-Address-box-input" type="text" required name="address" placeholder="街道， 小区门牌等详细地址" style="border-bottom: 1px solid #ccc;">
            </p>
        </div>
        <div class="aui-out text-center">
            <input type="submit" class="red-color" style="color:#fff;line-height: 25px;padding: 10px;border: none" value="保存并使用">
        </div>
    </form>
</section>
<script>

    $('#country').change(function(){
        var pid = $('#country').val();
        $.ajax({
            type: "GET",
            url: "{:url('index/shop/ajaxGetAreaByPid')}",
            data: {pid:pid},
            success: function(data){
                var str = '';
                var origin = "<option>请选择</option>";
                $.each(data,function (i,v) {
                    str += " <option value='" + v.id + "'>"+ v.cityname +"</option>";
                });
                $("#city").html(origin + str);
                $("#district").html(origin);
            },
            error:function(e){
                console.log('error',e);
            }
        });
    });

    $('#city').change(function(){
        var pid = $('#city').val();
        $.ajax({
            type: "GET",
            url: "{:url('index/shop/ajaxGetAreaByPid')}",
            data: {pid:pid},
            success: function(data){
                var str = '';
                $.each(data,function (i,v) {
                    str += " <option value='" + v.id + "'>"+ v.cityname +"</option>";
                });
                $("#district").html(origin + str);

            },
            error:function(e){
                console.log('error',e);
            }
        });
    });
</script>
<script type="text/javascript" src="__STATIC__/themes/js/aui.js?v={$v}"></script>
<script type="text/javascript" src="__STATIC__/themes/js/city.js?v={$v}"></script>
<script src="__STATIC__/js/h5/add_address_upgrade.js?v={$v}"></script>
<script src="__STATIC__/js/h5/j.js"></script>
<script src="__STATIC__/layer/mobile/layer.js"></script>
</body>
</html>